@import "../../../style/root.scss";
@import "../../template/share/share.scss";

.container {
    height: 100vh;
    // background-color: rgba(250, 250, 252, 1);
}
.scroll{
    height: 100vh;
}
.new-post{
    position: fixed;
    right: 0;
    top:80%;
    width: 242rpx;
    height: 76rpx;
}
.head{
    @include padding-box(50rpx 30rpx 0rpx 30rpx);
    @include space-between;
    position: relative;
    z-index: 9;
    .handle{
        @include padding-box(32rpx 24rpx);
        background: #ffffff;
        border-radius: 16px;
    }
    .handle-right{
        width: 426rpx;
    }
    .handle-left{
        width: 244rpx;
    }
    .title-box{
        @include space-between;
        .title{
            color: $black;
            font-size: $font-normal;
            font-weight: bold;
        }
        .attend{
            width: 36rpx;
            height: 36rpx;
        }
    }
    .report{
        display: flex;
        align-items: center;
        justify-content: space-around;
        .num{
            margin: 25rpx 0;
            color: #202536;
            font-size: $font-large;
            font-weight: bold; 
        }
        .name{
            color: #565868;
            margin-right: 22rpx;
        }
    }
    .existing{
        @include padding-box(32rpx 24rpx);
        background: #ffffff;
        border-radius: 16px;
    }
}
.body{
    width: 100%;
    border-radius: 24rpx 24rpx 0 0;
    // height: 70vh;
    background: #FFFFFF;
    position: relative;
    @include padding-box(30rpx 30rpx 0 30rpx);
    margin-top: 30rpx;
    .title{
        color: $black;
        font-size: $font-large;
        font-weight: bold;
    }
    .tabs{
        margin: 10rpx 0 10rpx 0;
        // border-bottom: 1rpx solid #E8E9EA;
    }
    .post-list{
        @include padding-box(0 0 120rpx 0);
    }
    .post-i{
        @include padding-box(30rpx 24rpx);
        background: $white;
        border-radius: 16rpx;
        margin: 20rpx 0;
        position: relative;
    }
    .post-exit{
        width: 69rpx;
        height: 69rpx;
        position: absolute;
        top: 0;
        left: 0;
    }
    .post-head{
        @include space-between;
        .post-head-left{
            display: flex;
            align-items: center;
        }
    }
    .head-work-type{
        color: #FFFFFF;
        font-size: $font-mini;
        border-radius: 21rpx;
        @include padding-box(4rpx 14rpx);
        flex: none;
    }
    
    .bg-grey{
        background: #DEE0E3 !important;
    }
    .bg-red{
        background: #FF7E68;
    }
    .head-title{
        color: $black;
        font-size: $font-normal;
        font-weight: bold;
        margin-left: 8rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 390rpx;
    }
    // .head-share{
    //     background: $orange;
    //     border-radius: 30rpx;
    //     @include space-between;
    //     width: 144rpx;
    //     height: 60rpx;
    //     color: #ffffff;
    //     font-size: $font-mini;
    //     flex: none;
    // }
    .share-img{
        width: 144rpx;
        height: 60rpx;
    }
    .head-share-text{
        margin-left: 21rpx;
    }
    .post-body{
        @include space-between;
        margin-top: 20rpx;
    }
    .body-company{
        color: #565868;
        // font-size: $font-mini;
    }
    .body-num{
        color: $orange;
        font-size: $font-normal;
        font-weight: bold;
    }
    .text-grey{
        color: #C9CBD8 !important;
    }
    .welfare-list{
        display: flex;
        align-items: center;
        margin-top: 20rpx;
        flex-wrap: wrap;
    }
    .welfare-i{
        @include padding-box(13rpx);
        background: #F4F4F7;
        border-radius: 8px;
        color: $grey;
        font-size: $font-mini;
        margin-right: 20rpx;
        margin-top: 10rpx;
    }
    .post-foot{
        margin-top: 20rpx;
        @include space-between;

    }
}
.search-box{
    @include padding-box(6rpx 0 0 0)
}
.search-box .search-input{
    // border: 1rpx solid #ffffff;
    background: #ffffff;
    height: 88rpx;
    font-size: 28rpx;
	background: #F4F4F7;
  }
  .search-box .search-icon{
      left: 25rpx;
  }
.line-decorate{
    width: 100%;
    height: 1rpx;
    border-top: 1rpx solid #EAEAEF;
    margin: 24rpx 0 14rpx 0;
}
.enable-btn{
    width: 131rpx;
    height: 60rpx;
    border-radius: 30rpx;
    border: 1rpx solid #C9CBD8;
    text-align: center;
    line-height: 60rpx;
    color: #565868;
}

.contacts-list{
    display: flex;
    align-items: center;
    .contacts-i{
        margin-right: -25rpx;
        width: 55rpx;
        height: 55rpx;
        // border: 1rpx solid #7FEABC;
        border-radius: 50%;
        background: #ccc;
    }
    .contacts-i-active{
        margin-left: -30rpx;
    }
    .contacts-text{
        margin-left: 16rpx;
    }
}

.long-btn{
    // position: unset;
}